<template>
	<view>
		<text>{{ timeLeft }}</text>
		<button @click="startCountdown">开始计时</button>
	</view>
</template>

<script setup>
	import {
		reactive,
	} from 'vue';
	import {
		onLoad,
		onShow
	} from '@dcloudio/uni-app'

	let data = reactive({
		timeLeft: 6, // 假设计时时间为60秒
		timer: null, // 计时器
	})

	function startCountdown() {
		if (data.timer) return; // 如果计时器已经存在，则不创建
		data.timer = setInterval(() => {
			if (data.timeLeft > 0) {
				data.timeLeft -= 1;
				console.log(data.timeLeft)
			} else {
				clearCountdown(); // 时间到了，清除计时器
				uni.showModal({
					title: '提示',
					content: '时间已到',
					showCancel: false,
				});
			}
		}, 1000);
	}

	function clearCountdown() {
		clearInterval(data.timer);
		data.timer = null;
		data.timeLeft = 6
	}
</script>

<style>
</style>